<template>
  <main-wrap>
    <div class="ptp4">
      <div class="weui-panel weui-panel_access">
        <div class="weui-panel__hd bbnone">匠诚维修服务</div>
        <div class="weui-grids">
          <report-grid-item class="weui-grid" v-for="item in category" :key="item.id" :item="item"></report-grid-item>
        </div>
      </div>
    </div>

    <my-tab-bar :curtab="0"></my-tab-bar>
  </main-wrap>
</template>

<script>
import MainWrap from '@/components/mainWrap'
import ReportGridItem from './reportGridItem'
import MyTabBar from '@/components/mytabbar'
import { mapState } from 'vuex'

export default {
  name: 'Report',
  components: {
    MainWrap,
    ReportGridItem,
    MyTabBar
  },
  computed: {
    ...mapState({
      category: 'category_data'
    })
  },
  mounted () {
    this.cm.overscroll(document.querySelector('.weui-panel'))
  }
}
</script>

<style lang="stylus" scoped>
.ptp4, .weui-panel
  height calc(100vh - 70px)
  overflow scroll
.weui-panel:after
  border-bottom: none
.weui-grid
  padding 30px 10px
</style>
